<template>
<!--我的余额-页面----->
    <div class="balance">
      <Top><p>我的余额</p></Top>
<!--------------------------------------------------------->
         <div class="content">
             <div class="white">
               <div class="header">
                   <span>当前余额</span>
                       <i class="layui-icon layui-icon-help"></i>
                       <span @click="$router.push('/yver/hong')">余额说明</span>
               </div>
                 <div class="count">
                     <p style="display: inline-block">0.00</p>
                     <span>元</span>
                 </div>
                 <div class="promit">提现</div>
             </div>
         </div>
         <div class="detail">
             <p>交易明细</p>
         </div>
<router-view></router-view>

    </div>
</template>

<script>
    import Top from "@/components/Top";
    export default {
        name: "Balance",
      components: {Top},
      methods:{
            toprofile(){
                this.$router.push("/profile")
            }
        }
    }
</script>

<style scoped>
    .blue{
        text-align: center;
        width:23.4rem;
        height:3rem;
        background-color: #3190e8;
        position: relative;
        /*overflow: hidden;*/
    }

    .blue span{
        font-size:1.3rem;
        line-height: 2.95rem;
        color: white;
        font-weight: bold;
    }
    .layui-icon-left{
        font-size: 1.5rem;
        color: white;
        position: absolute;
        top:0.6rem;
        left:1rem;
    }
    .content{
        height:11rem;
        width: 23.4rem;
        background-color: #3190e8;
       padding-top: 1rem;
        }
    .white{
        width: 94%;
        height:10rem;
        background-color: white;
        border-radius: 2px;
        margin-left:3%;
    }
    .header{
        padding-top:0.5rem;
        margin-left: 1rem;
    }
    .header i{
            margin-left:12rem;
            color:#3190e8;
    }

    .header span:nth-of-type(1){
        color: #666666;
    }
    .header span:nth-of-type(2){
        color: #3190e8;
        margin-left:0rem;
    }
    .count p{
        margin-top: 0.2rem;
        margin-left: 1rem;
        font-size: 3rem;
    }
    .count span{
        margin-left: 0.51rem;
        font-size: 1.2rem;
    }
    .promit{
        margin-left: 5%;
        width: 90%;
        height: 3rem;
        font-size: 1.2rem;
        color: #fff;
        border-radius: .15rem;
        line-height: 3rem;
        margin-top: 1rem;
        text-align: center;
        background-color: #ccc;
    }
    .detail p{
        font-size: 1rem;
        color: #999;
        line-height: 2rem;
        padding-left: 1rem;
    }
</style>